<template>
  <div class="operation-log">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{path:'/sys/operationLog?navIndex=0'}">首页</el-breadcrumb-item>
      <el-breadcrumb-item>操作日志</el-breadcrumb-item>
    </el-breadcrumb>

    <section class="section-content">
      <el-main class="content-wrapper">
        <el-row class="my-margin-top-10">
          <el-table
            v-loading="table.loading"
            :data="table.tableData"
            border
            stripe
            style="width:100%"
            size="small"
            :highlight-current-row="true"
            ref="multipleTable"
          >
            <el-table-column prop="createTime" label="操作时间" width="180"></el-table-column>
            <el-table-column prop="realName" label="操作人" width="180"></el-table-column>
            <el-table-column width="200" prop="phoneNum" label="手机号"></el-table-column>
            <el-table-column label="操作内容" min-width="150">
              <template slot-scope="scope">
                <span style="white-space: nowrap;" :title="scope.row.msg">{{scope.row.msg}}</span>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination
            class="my-margin-top-10 my-el-pagination"
            @current-change="currentChangeHandle"
            :current-page="table.currentPage"
            :page-size="table.pageSize"
            layout="total, prev, pager, next, jumper"
            :total="table.rowCount"
          ></el-pagination>
        </el-row>
      </el-main>
    </section>
  </div>
</template>

<script>
import { setItem, getItem } from "../../tools/common";

export default {
  data() {
    return {
      table: {
        tableData: [],
        currentPage: 1,
        pageSize: 10,
        rowCount: 0,
        loading: false
      }
    };
  },
  methods: {
    currentChangeHandle(currentPage) {
      this.table.currentPage = currentPage;
      this.fetchData();
    },
    fetchData() {
      let url = "/logger/list";
      let info = getItem("info") ? getItem("info") : {};
      let p = {
        communityId: info.communityId,
        start: (this.table.currentPage - 1) * this.table.pageSize,
        num: this.table.pageSize
      };
      this.table.loading = true;
      this.$http
        .fetch(url, p)
        .then(res => {
          this.table.tableData = res.data.rows;
          this.table.rowCount = res.data.total
          this.table.loading = false;
        })
        .catch(err => {
          this.table.loading = false;

          console.log("error");
        });
    }
  },
  mounted() {
    this.fetchData();
  }
};
</script>

<style scoped>
</style>


